<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
		<title>
			Fancytree - Example
		</title>
		<script src="../lib/jquery.js" type="text/javascript">
		</script>
		<script src="../lib/jquery-ui.custom.js" type="text/javascript">
		</script>
		<link href="../src/skin-xp/ui.fancytree.css" rel="stylesheet" type="text/css">
		<script src="../src/jquery.fancytree.js" type="text/javascript">
		</script>
		<!-- Start_Exclude: This block is not part of the sample code -->
		<link href="../lib/prettify.css" rel="stylesheet">
		<script src="../lib/prettify.js" type="text/javascript">
		</script>
		<link href="sample.css" rel="stylesheet" type="text/css">
		<script src="sample.js" type="text/javascript">
		</script>
		<!-- End_Exclude -->
		<script type="text/javascript">
			function ExpandAll3() {
				var start = new Date().getTime();

				//$("#tree2").fancytree("getRootNode").render();
				$("#tree2").fancytree("getRootNode").visit(function(node) {
					node.setExpanded(true);
				});

				var end = new Date().getTime();
				var time = end - start;
				console.log('expand time: ' + time);

				expanddone = new Date().getTime();
			}
			$(function() {
				$("#btnpagerender").click(function() {
					var end = new Date().getTime();
					var holdingtime = end - expanddone;

					$("#pagerender").text(holdingtime);

				});

				//no animations and no render/create node events
				$("#tree2").fancytree({
					source: {
						url: "ajax10k_nodes.json"
					},
					toggleEffect: null,
					renderNodeEvents: false
				});

				$("#test").click(function() {
					ExpandAll3();
				});
			});

			var expanddone;
		</script>
	</head>

	<body class="example">
		<button id="test">
			Expand All Folders
		</button>
		<button id="btnpagerender">
			Click After the Page Stops Rendering (scrollbar appears/icons load)
		</button>
		<div id="pagerender">
		</div>
		<p>
			Tree with embedded JSON data
		</p>
		<div id="tree2" class="sampletree">
		</div>
		<pre id="sourceCode" class="prettyprint" style="display:none">
		</pre>
		<!-- End_Exclude -->
	</body>

</html>
